Emblemicons – 免費開源圖標 Icons，高達 1000+ 個產品開發、設計與業務展示的圖標樣式免費下載

用 AI 摘要這篇文章：

ChatGPT Claude Perplexity Gemini Grok

Emblemicons 是一套免費開源圖標庫，收錄超過 1,000 個涵蓋產品開發、UI 設計、業務簡報與學術專案的常用圖標，每個圖標提供 6 種尺寸（12px 到 72px）與 4 種格式（PNG、JPG、PDF、SVG），採 MIT 授權可免費商用且無需署名。

如果你需要一套能直接用於商業產品、客戶專案或簡報的圖標，Emblemicons 的 MIT 授權和多尺寸輸出能省下授權費與手動調整尺寸的時間。原始官網 emblemicons.in 已下線，但目前可透過 emblemicons.netlify.app 瀏覽所有圖標，也可以從 Figma Community 一鍵複製完整圖標庫。

和其他免費圖標庫相比，Emblemicons 的定位很明確：Tabler Icons 收錄超過 5,500 個圖標、CSS.GG 走純 CSS 技術路線、Remix Icon 提供超過 2,000 個開源圖標，而 Emblemicons 的差異化在於每個圖標都直接提供 6 種固定尺寸的現成檔案，不需要額外透過 圖片格式轉換工具 處理。

官方網站：https://emblemicons.in/（已下線，改用 netlify 鏡像站）
Figma Community：Emblemicons Figma 檔案
GitHub 原始碼：emblemicons/emblemicons
授權方式：MIT License

Emblemicons 是什麼？免費開源 MIT 授權圖標庫

Emblemicons 是由設計師 Manish Bharvey 於 2020 年建立的開源圖標庫，收錄超過 1,000 個涵蓋介面操作、商務展示、開發工具與學術專案等場景的常用圖標。所有圖標以 MIT License 釋出，這意味著你可以將圖標用於個人專案、商業產品、客戶交付甚至修改後再發布，完全不需要付費，只需在專案中保留一份 MIT 授權條款副本即可。

這個專案曾在 Product Hunt 上獲得當日第 4 名的成績，圖標涵蓋箭頭、選單、關閉按鈕、圖表、文件、程式碼、終端機、書本、實驗等常見類別，對需要快速建立產品原型或簡報素材的團隊來說是一個開箱即用的選擇。

截至 2026 年 5 月，原始官網 emblemicons.in 已下線（域名停放出售），但專案仍持續維護。你可以透過 GitHub 上的 emblemicons/emblemicons 原始碼庫存取所有檔案，官方也在 Netlify 上架設了 鏡像站 提供完整的搜尋與下載功能。最推薦的取得方式仍是前往 Figma Community 上的 Emblemicons 檔案，一鍵複製全部圖標到你的 Figma 帳號。你也可以透過第三方 SVG 資源網站（例如 SVG Repo）搜尋部分圖標。

Pin

圖標規格與格式：6 種尺寸 × 4 種格式

Emblemicons 的核心設計是每個圖標都提供固定的輸出組合，讓使用者在不同場景下能直接取用合適的尺寸和格式，不需要額外用 向量圖轉換服務 處理。

每個尺寸都提供以下 4 種格式：

• PNG：支援透明背景，適合簡報與文件
• JPG：檔案較小但不支援透明，適合有背景色的場合
• PDF：保持向量品質，適合印刷品或文件嵌入
• SVG：向量格式，可無限縮放不失真，適合網頁與設計稿

Pin

除了檔案下載，Emblemicons 也提供每個圖標的 SVG HTML 程式碼，可以直接複製貼到 HTML 原始碼中顯示圖標，不需要載入額外圖片。這對前端開發者來說相當實用。如果需要對 SVG 做進一步壓縮，可以搭配 SVGOMG 工具減少檔案大小。

Pin

如果需要將圖標轉為網站或 App 的 favicon，可以搭配 Iconpie 網站圖標產生器 或 SVG Favicon Maker 來產生對應格式。

MIT 授權條款說明：商用、修改與再發布

Emblemicons 的所有圖標採用 MIT License 釋出，這是目前最廣泛使用的開源授權條款之一。MIT 授權允許的行為包括：

• 免費下載與使用所有圖標
• 將圖標用於商業產品、付費服務或客戶專案
• 修改圖標的外觀、尺寸、顏色或樣式
• 將修改後的圖標重新發布或嵌入自己的作品中
• 將圖標包含在付費的設計模板或 UI 套件中銷售

MIT 授權的唯一要求是：在使用或分發時保留原始的版權聲明與授權條款副本。實務上，在你的專案目錄中放一份 LICENSE 檔案，或在關於頁面中標註授權資訊即可。與 iconmonstr 採用的 CC0 授權 不同，MIT 授權要求保留聲明，但提供了更明確的法律保護。同樣採用 MIT 授權的還有 Simple Icons 品牌圖標庫，兩者在授權條件上是一致的。

對台灣的設計師與開發者來說，MIT 授權的好處是不需要擔心署名方式或使用次數限制。你可以放心把 Emblemicons 圖標用在客戶的商業專案中，只要在專案的授權說明中保留 MIT 條款副本即可。如果對授權還有疑慮，建議直接參考 MIT License 原文。

如何取得 Emblemicons 圖標：四個管道

截至 2026 年 5 月，取得 Emblemicons 圖標的管道如下：

Figma Community（最推薦）

前往 Figma Community 上的 Emblemicons 頁面，點擊「Open in Figma」即可將完整圖標庫複製到你的 Figma 帳號。這個管道目前仍然有效，包含全部 1,000+ 個圖標，每個都可以在 Figma 中直接調整尺寸、顏色與樣式後匯出。

Netlify 鏡像站（瀏覽與下載）

官方在 Netlify 上維護了一份完整鏡像站 emblemicons.netlify.app，功能與原始官網相同：支援搜尋、瀏覽所有圖標，並提供 6 種尺寸 × 4 種格式的下載，以及 SVG HTML Code 複製。這是目前唯一仍在運作的官方瀏覽介面。

GitHub 原始碼庫（開發者）

所有圖標的 SVG 原始檔案都存放在 GitHub 原始碼庫 中，你可以直接 clone 或下載整個儲存庫取得所有檔案。這個儲存庫有 39 個星星和 3 個分支，最新的提交記錄是 2026 年 3 月（Ruby 版本更新）。

社群維護的 npm 套件（前端專案）

Emblemicons 本身沒有發布官方 npm 套件，但社群已經製作了幾個封裝版本：@iconizza-json/emblemicons（Iconizza JSON 格式）、@roku-ui/icons-emblemicons（Roku UI 圖標元件），以及 @ngxi/emblemicons（Angular 元件）。這些套件都不是 Emblemicons 官方維護的，功能與更新頻率取決於各自維護者。

如果你需要更多開源圖標的替代選擇，可以參考 Optimizilla 圖片壓縮服務、PngPix 透明背景圖片素材庫，以及 IconPark 由字節跳動出品的客製化圖標。

在 Figma 中使用 Emblemicons 的完整流程

Figma 是目前最多設計團隊使用的介面設計工具，Emblemicons 提供了完整的 Figma Community 檔案，讓你直接在 Figma 中使用全部圖標。以下是三個步驟。

步驟一：複製圖標庫到 Figma

前往 Figma Community 的 Emblemicons 頁面，點擊右上角的「Open in Figma」按鈕。系統會自動將完整圖標庫以新檔案的形式加入你的 Figma 工作區。如果搭配 Free Deca UI Kit 或 UI Design Daily 每日設計資源 一起使用，可以快速建立完整的介面設計。

步驟二：在設計稿中使用圖標

複製完成後，在 Figma 的檔案列表中找到 Emblemicons 檔案。打開後會看到所有圖標按分類排列，直接將需要的圖標複製貼到你的設計稿即可。由於圖標是向量格式，你可以自由調整大小、顏色與樣式而不會失真。如果需要調整圖標顏色來配合品牌色，可以搭配 Color Palette Generator 調色盤產生器 或 PaletteMaker 配色工具 來找到適合的配色方案。

步驟三：匯出圖標用於開發

在 Figma 中選取圖標後，可以在右側面板設定匯出格式（SVG、PNG 等）與尺寸，然後點擊匯出按鈕即可下載。匯出的 SVG 檔案可以直接交給前端開發者嵌入網頁使用。如果你需要將圖標套用在不同材質的展示場景中，Clay Mockups 提供了各種免費的 3D 樣機素材可以搭配使用。而 Adobe Creative Cloud Express 與 Pixelcut Image Recolor 則提供了額外的線上設計與調色工具。

SVG HTML Code 嵌入網頁的實作方式

Emblemicons 的實用特色之一是提供 SVG 的 HTML 程式碼，讓你直接將圖標嵌入網頁，不需要載入額外圖片或圖標字體。

在 Emblemicons 圖標頁面下方找到「HTML Code」區塊，複製 SVG 標籤程式碼後貼到 HTML 檔案中。圖標會以行內 SVG 的方式直接顯示在網頁上。你可以透過 CSS 的 color 或 fill 屬性改變圖標顏色，也可以用 width 和 height 調整顯示尺寸。

行內 SVG 不需要額外的 HTTP 請求，瀏覽器可以直接渲染。如果你的頁面使用了大量圖標，建議搭配 Compressor.io 圖片壓縮工具 或 ShortPixel 壓縮服務 來優化 SVG 檔案大小。對於需要將圖片轉換為 WebP 格式以提升載入速度的網站，可以參考 WebP 在 WordPress 中的使用教學。

在 WordPress 的 Gutenberg 編輯器中，你可以加入「自訂 HTML」區塊，然後將 SVG 程式碼貼入其中。如果你的佈景主題有額外的 CSS 樣式設定，可以用 CSS Gradient、CSS Background Patterns 或 CSS box-shadow 範例 為圖標加上漸層、背景或陰影效果。若需要波浪造型的裝飾元素，SVG Waves 可以快速產生可客製化的波浪 SVG 圖片。

對於注重網站效能的 WordPress 管理員，建議搭配 WordPress 緩存快取外掛 與 Cloudflare CDN 來確保頁面載入速度。同時可以使用 WordPress SEO 外掛 來確保圖標的 alt 文字與結構化資料正確設定。

Emblemicons 與其他免費圖標庫比較

市面上有許多免費的開源圖標庫可供選擇，以下將 Emblemicons 與幾款主流圖標庫進行比較，幫助你根據專案需求做出選擇。

從比較表可以看出，Emblemicons 的優勢在於每個圖標都提供 6 種固定尺寸的現成輸出。如果你的專案需要更大的圖標數量或更靈活的客製化能力，Tabler Icons 的 5,500+ 圖標量與線上客製化功能會是更好的選擇。CSS.GG 的純 CSS 技術實作則適合不需要載入額外字體或圖片的前端專案。

如果你需要的是大量圖標資源而不是單一圖標庫，Brusheezy Photoshop 筆刷設計資源、LineIcons 提供超過 2,000 個線形圖標、FindIcons 全球最大圖示搜尋引擎，都是值得搭配使用的資源。

適合誰 / 不適合誰

限制與注意事項

使用 Emblemicons 前需要了解幾個限制：

• 圖標數量有限：1,000+ 個圖標涵蓋常見場景，但如果你需要大量品牌圖標或特殊主題圖標，Flaticon 或 Icons8 的資源更豐富。
• 只有單色圖標：所有圖標都是單色線條風格，不支援彩色或動態圖標。需要動態效果的話可以參考 Animated Icons by Icons8。
• 原始官網已下線：雖然 Netlify 鏡像站仍在運作，但原始域名 emblemicons.in 已停放出售，未來如果 GitHub 或 Netlify 停止託管，取得管道可能受限。建議下載後在本機備份。
• 沒有官方 npm 套件：社群封裝的套件（如 @iconizza-json/emblemicons）不是官方維護的，功能和更新頻率取決於各維護者。如果穩定性很重要，建議直接從 Figma 或 GitHub 取得原始檔案。
• 更新頻率低：GitHub 儲存庫最近的提交主要是基礎設施維護（Ruby 版本更新），圖標內容自 2023 年起沒有新增。如果需要持續擴充的圖標庫，Tabler Icons 的活躍度更高。

更多免費圖標與設計資源推薦

除了 Emblemicons 之外，以下列出幾個 TechMoon 介紹過的相關資源。

免費圖標庫

• Unicons Solid：3,300+ 圖標，涵蓋 27 種類別與 3 種樣式，MIT 授權可商用
• Iconstore：234+ 高畫質圖標集合包，CC0 授權可免費商用
• Iconhub：6 種不同樣式的免費圖標，支援自定義與商業用途
• Animated Icons by Icons8：動態圖標資源，為介面增添動態效果
• Heroicons.dev：176+ 個開源圖示，一鍵複製 SVG 程式碼
• Flaticon：全球最大的免費圖標庫，需署名即可商用
• Icons8：圖標、插圖、音樂一站式設計資源平台
• Radix Icons：開源高品質圖標，適用於現代 UI 設計

免費設計素材與工具

• DesignEvo：免費線上 Logo 設計工具，內建 10,000+ Logo 範本
• Freepik：超過 2,000 萬個免費圖片與向量圖素材的線上圖庫
• Freebiesbug：設計師最愛的各種資源素材庫，提供 PSD、Illustrator、Sketch 格式
• FreeImages：超過 300,000+ 免版稅圖片的線上圖庫
• Free Vector Illustrations：150+ 免費插圖，無須署名且可用於商業用途
• Free Stock Photos Icons8：免費無版權線上圖庫，註明來源即可使用
• Free IMG：免費圖片資源平台
• Free Userpics Pack：100 個獨特風格虛擬人物頭像素材
• Free Typography Logo Maker：一秒建立文字 Logo 產生器
• Logo Instant：可商用免費 Logo 素材下載，包含原始 AI 檔
• Illustration Kit：專業設計師提供的免費向量素材庫
• Freeimage host：無限容量的免費圖片空間
• Pngtree：超過 400 萬張 PNG 圖片、背景、文字效果素材
• Freerange Stock：專業級品質可商用免費圖庫
• photoAC：超過 300 萬張來自日本的高品質可商用圖片素材
• DesignCap：免費線上圖片編輯器，大量範本一鍵套用

以上資源大多提供免費版本或免費方案，授權條款從 CC0、MIT 到需要署名的各種類型都有。在使用前建議先確認各資源的授權條款是否符合你的專案需求。

Emblemicons 常見問題 FAQ

Emblemicons 官方網站還能用嗎？

原始官網 emblemicons.in 已下線，域名處於停放出售狀態。但官方在 Netlify 上維護了一份功能完整的鏡像站 emblemicons.netlify.app，支援搜尋、瀏覽與下載所有圖標。此外你也可以透過 Figma Community 或 GitHub 原始碼庫取得圖標。

Emblemicons 圖標可以商用嗎？

可以。所有圖標採用 MIT License 釋出，允許免費商業使用、修改與再發布。你只需要在專案中保留 MIT 授權條款副本即可，無需付費或署名來源。MIT 授權比 CC BY 4.0（Font Awesome 免費版）更寬鬆，因為不需要在頁面上標註出處。

如何在 WordPress 網站中使用 Emblemicons 圖標？

有兩種方式。第一種是從 Figma Community 取得圖標後匯出 SVG 檔案，再上傳到 WordPress 媒體庫中使用。第二種是複製 SVG HTML Code，在 Gutenberg 編輯器中加入「自訂 HTML」區塊並貼上程式碼。如果你的網站使用大量圖標，建議搭配 WordPress 緩存快取外掛 來維持頁面載入效能，並參考 WordPress 網站加速技巧 進一步優化。選擇一個穩定快速的主機也很重要，可以參考 WordPress 虛擬主機推薦。

Emblemicons 與 Font Awesome 有什麼不同？

最大的差異在授權與使用方式。Emblemicons 採用 MIT 授權，完全免費且可商用；Font Awesome 免費版採用 CC BY 4.0 授權，需要署名才能商用，進階功能則需要付費訂閱 Pro 方案。技術上，Emblemicons 提供獨立的 SVG 檔案與 HTML Code，Font Awesome 主要透過字體檔案或 CDN 引入。如果你需要完全免費無限制的圖標資源，Emblemicons 與其他 MIT 授權的圖標庫（如 Tabler Icons、CSS.GG）會是更適合的選擇。

如何在 Figma 中取得 Emblemicons 圖標？

前往 Figma Community 搜尋「Emblemicons」或直接開啟 Emblemicons Figma 檔案，點擊「Open in Figma」按鈕即可將完整圖標庫複製到你的 Figma 帳號。複製完成後可以在 Figma 檔案列表中找到，所有 1,000+ 個圖標都可以直接在設計稿中使用，支援調整尺寸、顏色與樣式後匯出為 SVG 或 PNG 格式。

Pin

Emblemicons 重點整理

• 1,000+ 個常用圖標，MIT 授權免費商用
• 6 種尺寸（12px 到 72px）× 4 種格式（PNG/JPG/PDF/SVG）
• 支援 Figma Community 一鍵複製使用
• 提供 SVG HTML Code 直接嵌入網頁
• 原始官網已下線，可透過 Netlify 鏡像站或 Figma 取得
• 無需署名，適合商業產品與客戶專案

如果你剛開始建立設計資源庫，建議先從 Figma Community 複製 Emblemicons 到你的 Figma 工作區，再根據實際專案需求搭配 Tabler Icons 或 Heroicons 等其他 MIT 授權圖標庫一起使用。這三個圖標庫加起來已經能涵蓋大多數產品介面與簡報的圖標需求。如果需要調整圖標的 SVG 檔案大小，用 SVGOMG 壓縮後再嵌入網頁，可以減少約 20% 到 40% 的檔案體積。